enyo.kind({
	name: "enyo.AssessmentUI",
	kind: enyo.VFlexBox,
	components: [
		{kind : "Popup", name: "messagePopup", lazy: false, components : [
			{type: "HtmlContent", name: "popupContent", content : "", onclick: "popupContentClick", style: "padding: 20px; text-align: center"},
			{kind: "Button", caption: "Close", onclick: "popupCloseClick", className: "black-bg"}
		]},
		{kind : "Popup", name: "debugPopup", lazy: false, components : [
			{kind: "RowGroup", caption: "Debug Option", components: [
				{kind: "HFlexBox", components: [
					{kind: "CheckBox", name: "dummyDataCheckBox", onChange: "dummyDataCheckClicked", checked: false, style: "margin-right: 10px;"},
					{content: "Use local dummy data"}
				]},
				{kind: "HFlexBox", components: [
					{kind: "CheckBox", name: "signInCheckBox", onChange: "signInCheckClicked", checked: false, style: "margin-right: 10px;"},
					{content: "Enable Sign In"}
				]}
			]},
			{kind: "RowGroup", caption: "Change Service Host", components: [
				{kind: "Input", name: "hostInput", style: "width: 400px", components: [
						{kind: "Button", caption: "Change", onclick: "hostChangeButtonClicked"}
					],
					hint: "Click here to change..."
				}
			]},
			{kind: "Button", caption: "Switch to Request List", onclick: "requestListButtonClick", className: "black-bg"},
			{kind: "Button", caption: "Close", onclick: "debugCloseClick", className: "black-bg"}
		]},
		{name: "slidingPane", kind: "SlidingPane", flex: 1, onSlideComplete: "slideComplete", components: [{name: "center"}]},
		{kind: "SpinnerLarge", name:"largeSpinner", style:"position: absolute; top: 100px; left: 100px;", showing: false}
	],
	
	constructor: function() {
		this.inherited(arguments);
	},
	
	slideComplete: function() {
		//console.log("slideComplete");
	},
	
	create: function() {
		this.inherited(arguments);
		
		//Set the position of loading animation
		var left = document.body.clientWidth / 2 - 60;
		var top = document.body.clientHeight / 2 - 60;
		this.$.largeSpinner.setStyle("position: absolute; top: " + top + "px; left: " + left + "px;");
		this.$.largeSpinner.setShowing(false);
		
		//console.log(screen.width)
		this.$.slidingPane.setMultiView(false);
		//show Login
		if(enyo.Config.useLoginEnable == true){
			enyo.Data.current_user = null;
			this.switchView("login");
		}else{
		//show home
			enyo.Data.current_user = null;
			this.switchView("home");
		}
	},
	
	switchView: function(viewName) {
		switch(viewName)
		{
			case "login":
				var p = {kind:"Login", onError:"panelError", onHeaderClick: "headerClick", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "home":
				var p = {kind: "Home", onError: "panelError", onSignOut: "signOut", onHeaderClick: "headerClick", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "create_type":
				var p = {kind: "CreateAssessmentType", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "create_device":
				var p = {kind: "CreateAssessmentDevice", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "create_summary":
				var p = {kind: "CreateAssessmentSummary", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "create_result":
				var p = {kind: "CreateAssessmentResult", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "report_request":
				var p = {kind: "AssessmentReportRequest", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "report_run":
				var p = {kind: "AssessmentReportRun", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			case "report_detail":
				var p = {kind: "AssessmentReportDetail", onError: "panelError", onSignOut: "signOut", flex: 1, parentWnd: this};
				this.setCurrentView(p);
				break;
			default:
				break;
		}
	},
	
	setCurrentView: function(inConfig) {
		this.$.slidingPane.selectViewImmediate(this.$.center);
		
		var inControl = this.$.center;
		inControl.destroyControls();
		if (inConfig) {
			inControl.createComponent(inConfig, {owner: this.$.slidingPane.owner});
			inControl.renderContent();
		}
	},
	
	showScrim: function() {
		enyo.scrim.show();
		this.$.largeSpinner.setShowing(true);
	},
	
	hideScrim: function() {
		setTimeout(this.delayHideScrim.bind(this), 500);
	},
	
	delayHideScrim: function() {
		this.$.largeSpinner.setShowing(false);
		enyo.scrim.hide();
	},
	
	showMsg: function(errorMsg) {
		this.hideScrim();
		this.$.popupContent.setContent(errorMsg);
		this.$.messagePopup.openAtCenter();
	},
	panelError: function(sender, errorMsg) {
		this.hideScrim();
		this.$.popupContent.setContent(errorMsg);
		this.$.messagePopup.openAtCenter();
	},
	popupCloseClick: function() {
		this.$.messagePopup.close();
	},
	
	signOut: function() {
		enyo.Data.signout_requested = true;
		this.switchView("login");
	},
	
	//Debug Dialog
	headerClick: function() {
		//Show the debug panel once the header is clicked.
		//Attach the onHeaderClick on Home and Login panel
		this.$.dummyDataCheckBox.setChecked(enyo.Config.useLocalCacheAll);
		this.$.signInCheckBox.setChecked(enyo.Config.useLoginEnable);
		this.$.hostInput.setValue(enyo.Config.baseServiceUrl);
		this.$.debugPopup.openAtCenter();
	},
	debugCloseClick: function() {
		this.$.debugPopup.close();
	},
	requestListButtonClick: function() {
		this.switchView("report_request");
	},
	dummyDataCheckClicked: function(inSender) {
		if (inSender.getChecked()) {
			enyo.Config.useLocalCacheAll = true;
		}else{
			enyo.Config.useLocalCacheAll = false;
		}
	},
	signInCheckClicked: function(inSender) {
		if (inSender.getChecked()) {
			enyo.Config.useLoginEnable = true;
			enyo.Data.current_user = null;
			this.switchView("login");
		}else{
			enyo.Config.useLoginEnable = false;
			enyo.Data.current_user = null;
			this.switchView("home");
		}
	},
	hostChangeButtonClicked: function() {
		enyo.Config.baseServiceUrl = this.$.hostInput.value;
		console.log(enyo.Config.baseServiceUrl);
	}
});